<template>
    <div class="contractdetail">
        <section>
            <el-row>
                <el-col :lg="6">
                    合同状态：<span v-text="contractdetail.statusText"></span>
                </el-col>
                <el-col :lg="6">
                    创建时间：<span v-text="contractdetail.statusLastTime"></span>
                </el-col>
                <el-col :lg="6">
                    甲方确认时间：<span v-text="contractdetail.statusLastTime"></span>
                </el-col>
                <el-col :lg="6">
                    乙方确认时间: <span v-text="contractdetail.statusLastTime"></span>
                </el-col>
            </el-row>
        </section>
        <section class="mt-15">
            <h3>甲方基本信息</h3>
            <div  class="mt-15">
                <el-row>
                    <el-col :span="12">
                        发包方(甲方)： <span v-text="contractdetail.employerAccountName"></span>
                    </el-col>
                    <el-col :span="12">
                        联系人：<span v-text="contractdetail.employerAccountLinkman" class="underline"></span>
                    </el-col>
                    <el-col :span="12">
                        联系电话：<span v-text="contractdetail.employerAccountMobile"></span>
                    </el-col>
                    <el-col :span="12">
                        电子邮箱：<span v-text="contractdetail.employerAccountEmail"></span>
                    </el-col>
                    <el-col :span="12">
                        身份证号码：<span v-text="contractdetail.employerAccountIdCardNum"></span>
                    </el-col>
                </el-row>
            </div>
        </section>
        <section class="mt-15">
            <h3>乙方基本信息</h3>
            <div  class="mt-15">
                <el-row>
                    <el-col :span="12">
                        接包方(乙方)： <span v-text="contractdetail.contractorAccountName"></span>
                    </el-col>
                    <el-col :span="12">
                        联系人：<span v-text="contractdetail.contractorAccountLinkman" class="underline"></span>
                    </el-col>
                    <el-col :span="12">
                        联系电话：<span v-text="contractdetail.contractorAccountMobile"></span>
                    </el-col>
                    <el-col :span="12">
                        电子邮箱：<span v-text="contractdetail.contractorAccountEmail"></span>
                    </el-col>
                    <el-col :span="12">
                        身份证号码：<span v-text="contractdetail.contractorAccountIdCardNum"></span>
                    </el-col>
                </el-row>
            </div>
        </section>
        <section class="mt-15">
            <h3>合同付款计划</h3>
            <div>
                合同金额： <span v-text="contractdetail.money" class="underline"></span>元
            </div>
            <div v-for="item in contractdetail.workPlanList">
                付款计划：项目阶段工期：<span v-text="item.workCycle" class="underline"></span>天，项目阶段金额：<span v-text="item.money" class="underline"></span> 元 验收标准：
                <span v-text="item.acceptanceRequirements" class="underline"></span>
            </div>
        </section>
        <section class="mt-15">
            <h3>功能需求</h3>
            <div v-text="contractdetail.content">

            </div>
        </section>
        <section class="mt-15">
            <h3>项目协议</h3>
            <div v-text="contractdetail.protocol">

            </div>
        </section>

    </div>
</template>
<script>
    import {
        getProjectContractDetail
    } from '@/api/project.js'
    export default {
        data () {
            return {
                contractdetail: {},
                id: this.$route.params.id
            }
        },
        methods: {
            // 获取合同信息
            fetchContractdetail (id) {
                getProjectContractDetail({id}).then((response) => {
                    if (response.data.code === 0) {
                        let d = response.data.data
                        switch (d.status) {
                        case 1:
                            d.statusText = '草稿'
                            break
                        case 2:
                            d.statusText = '待确认'
                            break
                        case 3:
                            d.statusText = '待托管阶段费用（已确认）'
                            break
                        case 4:
                            d.statusText = '进行中（已托管)'
                            break
                        case 6:
                            d.statusText = '待验收（已申请验收）'
                            break
                        case 7:
                            d.statusText = '已完成（已验收）'
                            break
                        case 8:
                            d.statusText = '已拒绝'
                            break
                        case 9:
                            d.statusText = '已终止'
                            break
                        }
                        this.contractdetail = response.data.data
                    } else if (response.data.code === 1) {
                        this.$message('获取失败')
                    }
                }).catch(function (err) {
                    console.log(err)
                })
            }
        },
        created () {
            this.fetchContractdetail(this.id)
        }
    }

</script>

<style scoped>
.contractdetail{
    margin: 0 auto;
    width: 1000px;
    line-height: 1.5;
}
.underline{
    text-decoration: underline
}
</style>
